<%@ page language="java" pageEncoding="UTF-8" %>
<%@ page language="java" import="java.util.*" %>
<%@page import="com.spring.util.*" %>
<%@page import="com.jntoo.db.*" %>
<%@ taglib prefix="ssm" uri="http://ssm" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ include file="head.jsp" %>
<%@ include file="header.jsp" %>

<link href="js/video/video-js.min.css" rel="stylesheet">
<script src="js/video/ie8/videojs-ie8.js"></script>
<script src="js/video/video.min.js"></script>


<div>


    <div class="container"><!-- 使用bootstrap css框架，container定宽，并剧中 https://v3.bootcss.com/css/#overview-container -->


        <div class="bilibili" style="margin:20px 0 0 0;background:#FFFFFF">
            <div class="plp-l">
                <div class="player-module">
                    <div class="stardust-player">
                        <div class="player">
                            <div class="bilibili-player relative">
                                <div class="bilibili-player-area">
                                    <div class="bilibili-player-video-wrap">
                                        <video id="example_video_1" class="video-js vjs-default-skin"
                                               style="width: 100%;height: 100%;min-height: 320px;" controls=""
                                               preload="none" poster="images/play.png" data-setup="{}">
                                            <source src="${map.shipin}" type="video/mp4">
                                            <track kind="captions" src="../shared/example-captions.vtt" srclang="en"
                                                   label="English"></track>
                                            <!-- Tracks need an ending tag thanks to IE9 -->
                                            <track kind="subtitles" src="../shared/example-captions.vtt" srclang="en"
                                                   label="English"></track>
                                            <!-- Tracks need an ending tag thanks to IE9 -->
                                            <p class="vjs-no-js">To view this video please enable JavaScript, and
                                                consider upgrading to a web browser that <a
                                                        href="http://videojs.com/html5-video-support/" target="_blank">supports
                                                    HTML5 video</a></p>
                                            </source>
                                        </video>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="plp-r">
                <div class="media-wrapper" style="color:#535353;">
                    <h1>${map.biaoti}</h1>
                    <div class="tool-bar clearfix">
                        <div class="like-info">
                        <span>
                            知识点                            :<ssm:sql var="mapzhishidian6" type="find">
                            SELECT zhishidian,id FROM zhishidian where id='${map.zhishidian}'
                        </ssm:sql>${mapzhishidian6.zhishidian}                        </span>
                        </div>
                        <div class="like-info">
                        <span>
                            教师                            :${map.jiaoshi}                        </span>
                        </div>
                        <div class="like-info">
                        <span>
                            发布时间                            :${map.addtime}                        </span>
                        </div>
                    </div>
                    <div class="media-info clearfix">
                        <div class="media-right">
                            <div class="media-rating">
                                <c:if test="${sessionScope.cx =='学生' && Query.make('xuanke').where('kejianid',map.id).where('xuankeren',sessionScope.username).count()==0}">
                                    <h4 class="score">
                                        <a href="xuankeadd.do?id=${map.id}">选课</a>
                                    </h4>
                                </c:if>
                                <p>${map.dianjilv}人点击</p>
                            </div>


                            <div class="media-desc">
                                ${Info.subStr(map.xiangqing, 120)}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <!-- container定宽，并剧中结束 --></div>


</div>


<div>


    <div class="container"><!-- 使用bootstrap css框架，container定宽，并剧中 https://v3.bootcss.com/css/#overview-container -->


        <div class="tabs" style="margin:20px 0 0 0">
            <!-- tabs切换页 -->
            <ul class="nav nav-tabs" role="tablist">
                <li role="presentation" class="active">
                    <a href="#ziyuanxiangqing" aria-controls="ziyuanxiangqing" role="tab" data-toggle="tab">资源详情</a>
                </li>
                <li role="presentation">
                    <a href="#pinglun" aria-controls="pinglun" role="tab" data-toggle="tab">留言</a>
                </li>
            </ul>
            <!-- Tab panes -->
            <div class="tab-content">
                <!--内容区 -->
                <div role="tabpanel" class="tab-pane active" id="ziyuanxiangqing">


                    <div style="margin:10px 10px 10px 10px ;text-indent: 1em">
                        ${map.xiangqing} </div>


                </div>
                <div role="tabpanel" class="tab-pane" id="pinglun">


                    <div class="gr-control-module-table" style="margin:10px 10px 10px 10px ">
                        <div class="">
                            <form action="liuyaninsert.do" method="post" onsubmit="return submitInsert()"><!-- form 标签开始 -->
                                <div class="form-group">
                                    <textarea style="width: 80%;height: 120px" class="form-control"
                                              name="neirong" id="neirong" placeholder="请输入评论内容"></textarea>

                                </div>
                                <script>
                                    function submitInsert(form) {
                                        var contentTxt = document.querySelector('#neirong').value;
                                        if (!contentTxt) {
                                            alert('请填写文本内容')
                                            return false;
                                        }
                                        return true;
                                    }
                                </script>
                                <input name="kejianid" type="hidden" id="kejianid" value="${param.id}"/>
                                <input name="biaoti" type="hidden" id="biaoti" value="${map.biaoti}"/>
                                <input name="zhishidian" type="hidden" id="zhishidian" value="${map.zhishidian}"/>
                                <input name="jiaoshi" type="hidden" id="jiaoshi" value="${map.jiaoshi}"/>
                                <input name="liuyanren" type="hidden" value="${sessionScope.username}"/>
                                <div style="text-align: left">
                                    <button type="submit" class="btn btn-primary">
                                        发布留言
                                    </button>
                                </div>

                                <!--form标签结束--></form>
                        </div>

                        ${pinglunList = Query.make("liuyan").where("kejianid", param.id).order("id desc").select();""}

                        <div class="mt10">
                            <c:forEach items="${pinglunList}" var="pl"><c:set var="pl" value="${pl}" scope="request"/>
                                ${user = Query.make("yonghu").where("username", pl.liuyanren).find();""}

                                <div class="comment clearfix">
                                    <div class="common-avatar J_User">
                                        <c:choose>
                                            <c:when test="${user.touxiang == null || '' == user.touxiang }">

                                                <img src="images/default.gif" width="100%" height="100%"/>
                                            </c:when><c:otherwise>
                                            <img src="${user.touxiang}" width="100%" height="100%"/>
                                        </c:otherwise></c:choose>
                                    </div>
                                    <div class="comment-block">
                                        <p class="comment-user">
                                            <span class="comment-username J_User"> ${user.xingming} </span>
                                            <span class="comment-time">${pl.addtime}</span>

                                            <a href="huifuadd.do?id=${pl.id}">回复</a>
                                        </p>
                                        <div class="comment-content J_CommentContent">${pl.neirong}</div>

                                            ${huifuList = Query.make("huifu").where("liuyanid", pl.id).order("id desc").select();""}

                                        <div class="reply J_ReplyBlock">
                                            <c:forEach items="${huifuList}" var="hf"><c:set var="hf" value="${hf}"
                                                                                            scope="request"/>
                                                <div class="reply-block">
                                                    <div class="reply-content">
                                            <span class="reply-user">
                                                <b class="reply-user-nick J_User"
                                                   data-userid="120161158">${hf.huifuren}</b>  : </span>
                                                            ${hf.huifuneirong}
                                                    </div>
                                                    <div class="reply-operate reply-operate--hot">
                                                        <i class="reply-dot">·</i>
                                                        <span>${hf.addtime}</span>
                                                    </div>
                                                </div>
                                            </c:forEach>

                                        </div>

                                    </div>
                                </div>
                            </c:forEach>
                        </div>

                    </div>


                </div>

            </div>
        </div>


        <!-- container定宽，并剧中结束 --></div>


</div>


<%@ include file="footer.jsp" %>
<%@ include file="foot.jsp" %>